﻿@model DrugStore.Models.DrugModel
@using MvcPaging
@using DrugStore.Dal
<div class="table-responsive">
    <table class="table table-striped table-bordered table-hover">
        <thead>
            <tr>
                <th>#</th>
                <th>Code</th>
                <th>TThuốc</th>
                <th>ĐVị</th>
                <th>MDMN</th>
                <th>CDùng</th>
                <th>CN</th>
            </tr>
        </thead>
        <tbody>
            @if (@Model.countDrug > 0)
            {
                int countDrug = 0;

                if (@Model.CurrentPage == 1)
                {
                    countDrug = 1;
                }
                else {
                    countDrug = 15 * (@Model.CurrentPage - 1) + 1;
                }

                foreach (var DrugValues in @Model.drugList)
                {

                    <tr>
                        <td>@countDrug</td>
                        <td>@DrugValues.code</td>
                        <td>@DrugValues.name</td>
                        <td>@DrugValues.nameUnit</td>
                        <td>@DrugValues.number_of_day</td>
                        <td>@DrugValues.manual</td>
                        <td>
                            <button type="button" class="btn btn-primary btn-circle-new">
                                <i class="fa fa-list"></i>
                            </button>
                        </td>
                    </tr>
                    countDrug++;
                }
            }
        </tbody>
    </table>
    <div class="text-center">
        @if (@Model.countDrug > 0)
        {
            @Html.Raw(Ajax.Pager(
            new Options
            {
                PageSize = 15,
                TotalItemCount = @Model.countDrug,
                CurrentPage = @Model.CurrentPage,
                ItemTexts = new ItemTexts() { First = "<", Previous = "«", Page = "", Next = "»", Last = ">" },
                ItemIcon = new ItemIcon() { First = "btn-social-icon", Previous = "icon-chevron-left", Next = "icon-chevron-right", Last = "icon-forward" },
                Size = Size.normal,
                Alignment = Alignment.centered,
                IsShowControls = true,
                IsShowFirstLast = true,
                IsShowPages = true,
                CssClass = "light-theme"
            },
            new AjaxOptions
            {
                UpdateTargetId = "listDrugPaging",
                OnBegin = "beginPaging",
                OnSuccess = "successPaging",
                OnFailure = "failurePaging"
            }, new { controller = "Drug", action = "PagingDrug", PageSize = 15, KeySearch = @Model.KeySearch }))

            
            int countDrug = 0;
            int countDrugTo = 15;

            if (@Model.CurrentPage == 1)
            {
                countDrug = 1;
            }
            else
            {
                countDrug = 15 * (@Model.CurrentPage - 1) + 1;
                countDrugTo = 15 * @Model.CurrentPage;
            }

            if (countDrugTo > @Model.countDrug)
            {
                countDrugTo = @Model.countDrug;
            }
            
            
            
            <div class="well">
                Hiển thị <span class="badge badge-success">@countDrug</span> to <span class="badge badge-success">@countDrugTo</span>
                của <span class="badge badge-info">@Model.countDrug</span>
            </div>
        }

        
    </div>

</div>
@*<div class="text-center">
        <a class="btn btn-social-icon btn-instagram"><i class="fa"><<</i></a>
        <a class="btn btn-social-icon btn-instagram"><i class="fa"><</i></a>
        <a class="btn btn-social-icon btn-linkedin"><i class="fa">1</i></a>
        <a class="btn btn-social-icon btn-instagram"><i class="fa">2</i></a>
        <a class="btn btn-social-icon btn-instagram"><i class="fa">3</i></a>
        <a class="btn btn-social-icon btn-instagram"><i class="fa">4</i></a>
        <a class="btn btn-social-icon btn-instagram"><i class="fa">5</i></a>
        <a class="btn btn-social-icon btn-instagram"><i class="fa">></i></a>
        <a class="btn btn-social-icon btn-instagram"><i class="fa">>></i></a>
    </div>*@

<!-- /.table-responsive -->